<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用例测试 | style.css / doc-view.css</title>
    <link rel="stylesheet" href="../normalize.css">
    <link rel="stylesheet" href="../doc-view.css">
    <style>
        .doc-view {
            border: 1px solid blue;
            margin: 50px 100px;
        }
    </style>
</head>

<body>

    <div class="doc-view">

        <h2>
            文档标题
        </h2>

        <p>
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容<span class="important">重要的内容</span>这是段落内容<span class="link">这是点击链接</span>这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容。
        </p>

        <p class="link">
            这是一个独立的这是点击链接内容.这是段落内容 这是段落内容
            <span class="outdated">
                过时的了的内容
            </span>
            这是段落内容 这是段落内容 这是段落内容
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容。
        </p>
        <p class="outdated">
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容。
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容。
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容。
            这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容 这是段落内容。
        </p>

        <h3>
            内容1
        </h3>

        <h4>
            二级标题
        </h4>

        <h3>
            内容2
        </h3>

        <table>
            <thead>
                <tr>
                    <td>标题1</td>
                    <td>标题2</td>
                    <td>标题3</td>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>1</th>
                    <th>2</th>
                    <th>3</th>
                </tr>
                <tr>
                    <th>1</th>
                    <th>2</th>
                    <th>3</th>
                </tr>
                <tr>
                    <th>1</th>
                    <th>2</th>
                    <th>3</th>
                </tr>
                <tr>
                    <td>1</td>
                    <th>2</th>
                    <th>3</th>
                </tr>
            </tbody>
        </table>

        <ul>
            <li>HTML</li>
            <li>CSS</li>
            <li>JavaScript</li>
        </ul>

        <ol>
            <li>HTML</li>
            <li>CSS</li>
            <li>JavaScript</li>
        </ol>

    </div>

</body>

</html>
